{% extends "_layouts/examples.html" %}
{% block title %}Forms / Required{% endblock %}

{% block standalone_css %}patterns_forms{% endblock %}

{% block content %}
<form>
  <label class="is-required">Indicates a required field</label>
  <div class="p-form-validation is-error">
    <label for="exampleTextInputError" class="is-required">Email address</label>
    <input class="p-form-validation__input" required type="email" id="exampleTextInputError" placeholder="e.g joe@bloggs.com" name="exampleTextInputError" autocomplete="email" aria-invalid="true" aria-describedby="exampleInputErrorMessage">
    <p class="p-form-validation__message" id="exampleInputErrorMessage">This field is required.</p>
  </div>
</form>
{% endblock %}
